<template>
  <div class="author">
    <div class="author-main">
      <div class="author-avatar">
        <img class="author-avatar-img" :src="img"/>
      </div>
      <div class="author-tag">
        <div class="author-name">{{name}}</div>
        <div class="author-time">{{time}}</div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'logon',
  inheritAttrs: false,
  props: {
    img: { type: String, default: '' }, // 头像图片
    name: { type: String, default: '' }, // 名称
    time: { type: String, default: '' } // 时间
  },
  data () {
    return {
    }
  }
}
</script>

<style scoped type="scss">
  .author-main{
    text-align: left;
    display: flex;
    align-items: center;
  }
  .author-avatar{
    display: flex;
    align-items: center;
  }
  .author-avatar-img{
    width: 40px;
    height: 40px;
    border-radius: 40px;
  }
  .author-tag{
    margin-left: 5px;
  }
  .author-name{
    font-size: 16px;
    color: #000;
    font-weight: bold;
  }
  .author-time{
    font-size: 12px;
    color: #808080;
  }
</style>
